<template>
  <Card>
    <template v-slot:title>
      {{ title }}
    </template>
    <div class="well">
      <div>
        <table class="table">
          <thead>
          <tr>
            <th>
              任务名称
            </th>
            <th>
              组织机构
            </th>
            <th>
              任务状态
            </th>
          </tr>
          </thead>
          <tbody id="pageMain">
          <tr v-for="item in list" :key="item.id" class="item">
            <td style="width:200px;">
              {{item.taskName}}
            </td>
            <td>
              {{item.relatedOrg}}
            </td>
            <td>
              {{item.taskStatus}}
            </td>

            <td>
              <router-link :to="`/task/${item.id}`">查看详情</router-link>
              &ensp;
            </td>
          </tr>

          </tbody>
        </table>
        <div id="pageBox">

        </div>
      </div>
    </div>
  </Card>
</template>

<script>


import {Card} from "view-ui-plus";

export default {
  name: "TaskList",
  components: {Card},

  data() {
    return {
    }
  },
  created() {
  },
  props: {
    title: String,
    list: Array,
  }
}
</script>

<style scoped>
.item td {
  border-bottom: 1px solid #eee;
  padding: 10px;
  width: 200px;
}
.well{
  display: flex;
  justify-content: center;
}
.well table {
  min-width: 1024px;
}
#pageBox {
  display: flex;
  justify-content:space-between;
}
</style>